var path = require("path");

var htmlWebpackPlugin = require("html-webpack-plugin");
const VueLoaderPlugin = require('vue-loader/lib/plugin');
module.exports = {
    entry: path.join(__dirname, './src/main.js'),
    output: {
        path: path.join(__dirname, './dist'),
        filename: 'bundle.js'

    },
    plugins: [ //所有webpack 插件的配置节点
        new htmlWebpackPlugin({
            template: path.join(__dirname, './src/index.html'), //指定模板文件路径
            filename: "index.html" //设置生成的内存中的页面名称
        }),
        new VueLoaderPlugin()
    ],
    module: { //这是配置所有第三方 loader 模块的
        rules: [ //第三方模块的匹配规则
            //处理 css 文件的 loader
            {test: /\.css$/, use: ['style-loader', 'css-loader']},
            // 处理 less 文件 的loader
            {test: /\.less/, use: ['style-loader', 'css-loader', 'less-loader']},
            //处理 scss 文件的 loader
            {test: /\.scss/, use: ['style-loader', 'css-loader', 'sass-loader']},
            {test: /\.ttf|eot|svg|woff|woff2$/, use: 'url-loader'},//处理字体文件的loader
            {test: /\.ipg|jpeg|svg|png|gif$/, use: 'url-loader'},//处理字体文件的loader
            {test: /\.js$/, use: 'babel-loader', exclude: /node_modules/},
            {test: /\.vue$/, use: 'vue-loader'}
        ]
    }
    // resolve: {
    //     alias: { //修改 Vue 被导入时候的包的路径
    //         // "vue$": "vue/dist/vue.js"
    //     }
    // }
};